import { Meta, Story, Canvas, ArgsTable } from '@storybook/addon-docs';
import { argTypesView } from "./helpers/helpers";

export const summaryDocs= { source: { code: `sections := component.SummarySections{}
    sections.AddText("Priority", fmt.Sprintf("%d", *pod.Spec.Priority))
    sections = append(sections, component.SummarySection{
      Header:  "Service Account",
      Content: contentLink,
    })
    sections.Add("Node", nodeLink)
    summary := component.NewSummary("Configuration", sections...)
    summary.SetAlert(component.NewAlert(component.AlertStatusInfo, component.AlertTypeDefault, "Info alert", false, nil))
    `
}};

export const alertConfig = {
  status: 'info',
  type: 'default',
  message: 'Info Alert'
};

export const summaryView= {
  metadata: {
    type: "summary",
    title: [{metadata: {type: "text"}, "config": {value: "Configuration"}}]
  },
  config: {
    sections: [{
      header: "Type",
      content: {metadata: {type: "text"}, "config": {value: "kubernetes.io/service-account-token"}}
    }],
    alert: alertConfig
  }
};

export const SummaryStoryTemplate = args => ({
  template: `<app-view-summary [view]= "view"></app-view-summary>`,
  argTypes: argTypesView,
  props: { view: args.view },
});

<h1>Summary component</h1>
<h2>Description</h2>

<p>The Summary component is used to show summary description of a specific resource.</p>
<p>A Summary component can optionally show an alert on the top of the component.</p>
<h2>Example</h2>

<Meta title="Components/Summary" argTypes = { argTypesView } />

<Canvas withToolbar>
  <Story name="Summary component"
         parameters={{ docs: summaryDocs }}
         args= {{ view: summaryView }}>
    { SummaryStoryTemplate.bind({}) }
  </Story>
</Canvas>

<h2>Props</h2>
<ArgsTable story = "Summary component" />
